import React, { useState } from 'react';
import { Modal, Checkbox, Button, message, Typography, Space } from 'antd';

const { Text } = Typography;

type Platform = 'xiaohongshu' | 'wechat' | 'zhihu' | 'toutiao' | 'nowcoder' | 'baijiahao' | 'juejin';

interface PlatformConfig {
  name: string;
  enabled: boolean;
  credentials: Record<string, string>;
}

interface PublishModalProps {
  open: boolean;
  onCancel: () => void;
  onPublish: (platforms: Platform[]) => void;
  platformConfigs: Record<Platform, PlatformConfig>;
  content: string;
}

const PublishModal: React.FC<PublishModalProps> = ({
  open,
  onCancel,
  onPublish,
  platformConfigs,
  content
}) => {
  const [selectedPlatforms, setSelectedPlatforms] = useState<Platform[]>([]);
  const [isPublishing, setIsPublishing] = useState<boolean>(false);
  
  // Get enabled platforms
  const enabledPlatforms = Object.entries(platformConfigs)
    .filter(([, config]) => config.enabled)
    .map(([key]) => key as Platform);
  
  // Handle platform selection change
  const handlePlatformChange = (checkedValues: string[]) => {
    setSelectedPlatforms(checkedValues as Platform[]);
  };
  
  // Handle publish button click
  const handlePublish = () => {
    if (selectedPlatforms.length === 0) {
      message.warning('请至少选择一个平台');
      return;
    }
    
    if (content.trim().length === 0) {
      message.warning('内容不能为空');
      return;
    }
    
    // Check if all selected platforms have credentials
    const missingCredentials = selectedPlatforms.filter(platform => {
      const credentials = platformConfigs[platform].credentials;
      return Object.keys(credentials).length === 0;
    });
    
    if (missingCredentials.length > 0) {
      const platformNames = missingCredentials.map(p => platformConfigs[p].name).join('、');
      message.warning(`${platformNames} 缺少账号配置，请先在设置中配置`);
      return;
    }
    
    // Start publishing
    setIsPublishing(true);
    
    // Simulate API call delay
    setTimeout(() => {
      onPublish(selectedPlatforms);
      setIsPublishing(false);
      setSelectedPlatforms([]);
    }, 1500);
  };
  
  return (
    <Modal
      title="发布内容"
      open={open}
      onCancel={onCancel}
      footer={[
        <Button key="cancel" onClick={onCancel}>
          取消
        </Button>,
        <Button 
          key="publish" 
          type="primary" 
          onClick={handlePublish}
          loading={isPublishing}
          disabled={selectedPlatforms.length === 0}
        >
          发布
        </Button>
      ]}
    >
      <Space direction="vertical" style={{ width: '100%' }}>
        <Text>选择要发布的平台：</Text>
        <Checkbox.Group 
          options={enabledPlatforms.map(platform => ({
            label: platformConfigs[platform].name,
            value: platform
          }))}
          onChange={handlePlatformChange}
          style={{ width: '100%' }}
        />
        
        <Text type="secondary" style={{ marginTop: 16 }}>
          内容字数：{content.length} 字
        </Text>
        
        {selectedPlatforms.length > 0 && (
          <Text type="success">
            将发布到：{selectedPlatforms.map(p => platformConfigs[p].name).join('、')}
          </Text>
        )}
      </Space>
    </Modal>
  );
};

export default PublishModal;
